<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="/context/mytags.jsp"%>
<t:base type="jquery,easyui,tools,DatePicker"></t:base>
 

<link rel="stylesheet" href="plug-in/ztree/css/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="plug-in/ztree/js/jquery.ztree.core-3.5.min.js"></script> 

<style>
	#playTable{
		width:100%;
		height:100%;
		border-collapse:collapse;
	}
	
	.player{
		border:1px solid gray;
		padding:0;
		margin:0;
		background-color: black;
	}
	 
</style>
<SCRIPT type="text/javascript">
 
	var setting = {
		async: {
			enable: true,
			url:"hacVideoController.do?tree"
		},
		data: {
			key: {
				name: "text"
			}
		},
		callback: {
			onAsyncSuccess: zTreeOnAsyncSuccess,
			onClick: zTreeOnClick
		}
	};
	
	var treeObj;
	var currentNode = null;
	$(document).ready(function(){
		$.fn.zTree.init($("#ztree"), setting);
		treeObj = $.fn.zTree.getZTreeObj("ztree");
	});
	
	function zTreeOnAsyncSuccess(event, treeId, treeNode, msg) {
		treeObj.expandAll(true);
		currentNode = treeObj.getNodesByFilter(function (node) { return node.level == 0 }, true).id;
	}
	
	function zTreeOnClick(event, treeId, treeNode) {
		 if(treeNode.parentTId != null){
			currentNode = treeNode.id;
			playVideo(treeNode.id);
		 } 
		
	};
	
	function getCurrentNode(){
		return currentNode;
	}
	
	
	 var NewValue=0.8;

    
     
   /*   var livepath= '2016001?test2:123456abc'; 
     var hostaddr='192.168.3.12'; 
     var rtmpstreamer='rtmp://'+hostaddr+'/live'; */
     
     var livepath= '5731?techshine:ae60b57ecd371621b9daddd28760b445';//getUrlParam('camid')+'?'+getUrlParam('username')+':'+getUrlParam('password'); //nvsid?帐号:密码      
     //var hostaddr='124.205.244.78';//window.location.hostname;//服务器ip地址
     var hostaddr='${ip}';
     var rtmpstreamer='rtmp://'+hostaddr+'/live';
     
     function LoadFlash(playerId,nvsId,width) {
          jwplayer(playerId).setup({
             flashplayer: "jwplayer.swf",
             type: 'rtmp',
             streamer: rtmpstreamer,
             file: nvsId + '?${name}:${pwd}' ,
             height:'100%',
             width: '100%',
             rtmp: { bufferlength: NewValue },
             autostart: 'true',
             controlbar:"none"
         });
     }
     
     $(document).ready(function(){
    	 var width = $('#playTable').width();
    	 var playerWidth = width/2;
    	 $('.player').css({
    		 width:playerWidth+"px"
    	 });
    	 
    	/* LoadFlash('player1','5731');
  	    LoadFlash('player2','5557');
  	    LoadFlash('player3','5553');
  	    LoadFlash('player4','5731'); */
     });
     
     var currWinIndex = 0;
     var playList = new Array(6);
     function playVideo(id){
    	 //判断是否正在播放，如果正在播放，则重新加载
    	 for(var i =0;i<6;i++){
    		 var playId = playList[i];
    		 if(id == playId){
    	    	 LoadFlash('player'+i,id);
    			 return;
    		 }
    	 }
    	 
    	 
    	 currWinIndex ++;
    	 if(currWinIndex >= 5) currWinIndex = 1;
    	 LoadFlash('player'+currWinIndex,id);
    	 playList[currWinIndex] = id;
     }
 
	 
</SCRIPT>

<style>
	.panel-tool a.layout-button-left{
		display:none;
	}
</style>

<div class="easyui-layout" fit="true">
	<div  data-options="collapsible:false" region="west" style="width: 150px;" title="实验室列表" split="true"   >
		<div class="easyui-panel" style="padding:0px;border:0px" fit="true" border="false" collapsible="false">
			<ul id="ztree" class="ztree"></ul>
		</div>
	</div>
	<div region="center" style="padding:0px;border:0px" >
	    <table id="playTable">
	    	<tr>
	    		<td  class='player'>
	    			<div id="player1"></div>
	    		</td>
	    		<td class='player'>
	    			<div id="player2"></div>
	    		</td>
	    	</tr>
	    	<tr style="height:50%;">
	    		<td  class='player'>
	    			<div id="player3"></div>
	    		</td>
	    		<td  class='player'>
	    			<div id="player4"></div>
	    		</td>
	    	</tr>
	    </table>
	</div>
</div>
<script type="text/javascript" src="./plug-in/jwplayer/jwplayer.js"></script>
 